<!--
 * @Descripttion: 本地供应商商品管理
 * @version:
 * @Author: 赵致喜
 * @Date: 2020-10-12 11:23:14
 * @LastEditors: 穆宏宇
 * @LastEditTime: 2020-11-25 16:28:32
-->
<template>
	<div>
		<div class="control-box">
			<!-- control 操作区 START -->
			<e-control :search-form-options="formOptions" :search-label-width="searchLabelWidth" :btns="btns"
				@on-search="searchControlHandle" @on-refresh="refreshControlHandle" @change-height="changeControlHeight"
				@changeSelect="changeSelect" @addlocal="add('LOCAL_SUPPLIER')" @addonline="add('DATA_CENTER')" @deleteAll="onDelete('select')"
				@selectable="selectable" v-on="$listeners"></e-control>
			<!-- control 操作区 END -->
		</div>
		<div class="table-box">
			<!-- table 数据表格 START -->
			<e-table :data="tableData" :columns="columns" stripe border :maxHeight="tableMaxHeight" style="width: 100%"
				:tableBtnType="0" @selection-change="changeTableSelectData" :current="pageData.pageNum"
				:total="pageData.total" @page-size-change="changePageSize" @page-current-change="changePageCurrent">
				<template slot-scope="{ scope }" slot="operation">
					<el-button @click="onDelete(scope.row)" type="warning" size="mini" icon="el-icon-delete"
						class="cancelBtn" plain>删除</el-button>
				</template>
			</e-table>
			<!-- table 数据表格 END -->
		</div>
		<!-- editDialog 编辑弹窗 START -->

		<el-dialog title="商品列表" :visible.sync="dialogVisible" width="100%">
			<div class="control-box">
				<!-- control 操作区 START -->
				<!-- <el-checkbox label="测试">测试</el-checkbox> -->
				<!-- <el-checkbox label="测试2">测试2</el-checkbox> -->
				<e-control :search-form-options="formOptions2" :btns="btns2" @on-search="searchControlHandle2"
					@on-refresh="refreshControlHandle2" @send="send"></e-control>

				<!-- control 操作区 END -->
			</div>
			<div class="table-box">
				<!-- table 数据表格 START -->
				<e-table :data="tableData2" :columns="columns2" :row-class-name="tableRowClassName" stripe border
					style="width: 100%" :tableBtnType="0" @selection-change="changeTableSelectData2"
					:current="pageData2.pageNum" :total="pageData2.total" @page-size-change="changePageSize2"
					@page-current-change="changePageCurrent2">
				</e-table>
				<!-- table 数据表格 END -->
			</div>

		</el-dialog>

		<!-- editDialog 编辑弹窗 END -->
	</div>
</template>

<script>
	import eControl from '@/components/e-control'
	// 查询特色
	import {
		getListForManage,
		setGoodsState,
		setIsAid,
		getLocalGoodItemDetail,
		systemHis,
		
		fupinlistAll,fupinlist,fupinadd,fupindelete
		
	} from '@/api/admin.api'
	import {goodsList} from '@/api/supplierActivity/goods.admin.js'

	import {
		formOptions,
		btns
	} from './control'
	import columns from './columns'

	import {
		formOptions2,
		btns2
	} from './control2'
	import columns2 from './columns2'



	import config from '@/config'
	import {
		quillEditor
	} from 'vue-quill-editor'
	import 'quill/dist/quill.core.css'
	import 'quill/dist/quill.snow.css'
	import 'quill/dist/quill.bubble.css'
	export default {
		name: 'local-supplier-commodity-management',
		components: {
			eControl,
			quillEditor
		},
		props: {},
		data() {
			return {
				tableBtnType: "",

				goodsStateMap: {
					COMMIT: "新提交",
					PASS: "审核通过",
					RETURN: "退回修改",
					DOWN: "商品下架"
				},

				// 表格表头
				columns,
				columns2,
				// 表单配置项
				formOptions,
				formOptions2,
				searchLabelWidth: '100px',
				// 按钮组
				btns,
				btns2,

				// 查询表单
				searchFormData: {},
				searchFormData2: {},
				// 控制区高度
				controlHeight: 0,
				// 表格数据
				tableData: [],
				tableData2: [],
				// 分页数据
				pageData: {
					// 当前分页
					pageNum: 1,
					// 分页条数
					pageSize: 10,
					// 数据总数
					total: 0
				},
				// 分页数据
				pageData2: {
					// 当前分页
					pageNum: 1,
					// 分页条数
					pageSize: 10,
					// 数据总数
					total: 0
				},
				// 表格选中数据
				tableSelectData: [],

				dialogVisible: false,
				dataId: '',
				dataDetail: {},
				DNS: {},
				type: '',
				compareList: [],
				ids:''
			}
		},
		watch: {},
		computed: {
			// 商品图片地址
			goodsUrl() {
				return function(item) {
					const host = window.location.host
					const {
						DNS
					} = this
					let flag = false
					// 遍历外网地址
					for (let i = 0, max = DNS.outernet.length; i < max; i++) {
						const item = DNS.outernet[i]
						if (item === host) {
							flag = true
							break
						}
					}
					// 外网地址
					if (flag) {
						return item.goodsImagePath
					}
					// 内外地址
					else {
						return item.goodsImagePathIntranet
					}
				}
			},
			// 组合查询条件和分页
			searchData() {
				const {
					pageNum,
					pageSize
				} = this.pageData
				return {
					...this.searchFormData,
					size: pageSize,
					current: pageNum
				}
				// return Object.assign(this.searchFormData,{size: pageSize},{current:pageNum})
			},
			// 表单实例
			dialogForm() {
				return this.$refs.dialogForm
			},
			//表格最大高度
			tableMaxHeight() {
				return window.innerHeight - this.controlHeight - 160
			},
			// 编辑框标题
			editDialogTitle() {
				return this.editDialogType === 0 ? '新增' : '编辑'
			},
			// 操作列自定义按钮
			operationBtn() {
				let btns
				this.columns.map(item => {
					if (item.slotName === 'operation') {
						btns = item.btns || []
					}
				})
				return btns
			}
		},
		methods: {
			onDelete(rows) {
				var that = this;
				fupindelete(rows.id || that.ids).then((res) => {
					that.getTableData();
					that.getTableData2();
				})
			},
			selectable(row) {
				return true;
			},
			changeSelect(data) {
				this.searchFormData = data;
			},
			send() {
				var that = this;
				fupinadd(this.tableSelectData2).then((res) => {
					that.getTableData();
					that.getTableData2();
					that.fangyilist();
				})
			},
			tableRowClassName({
				row,
				rowIndex
			}) {
				if (row.has == 1) {
					return 'has';
				}
			},
			add(t) {
				
				this.searchFormData2.goodName = "";
				this.searchFormData2.brandName = "";
				this.searchFormData2.goodsName = "";
				this.searchFormData2.goodsState = "";
				this.searchFormData2.isAid = "";
				this.searchFormData2.sku = "";
				this.searchFormData2.supplierName = "";
				this.searchFormData2.typeNo = "";
				
				this.type = t
				this.pageData2.pageNum = 1
				this.fangyilist();
				this.dialogVisible = true;
			},
			fangyilist() {
				var that = this;
				let tmpParam = {
					characteristicId:this.searchFormData.characteristicId,
					...this.searchFormData2
				}
				fupinlist(tmpParam).then(res => {
					that.compareList = res;
					this.getTableData2();
				})
			},
			getAid(isAid) {
				if (isAid == null || isAid == undefined) return '';
				if (isAid) return '是';
				return '否';
			},

			// 初始化表格数据请求
			init() {
				this.getTableData()
			},
			/**
			 * @functionName searchControlHandle
			 * @param {Object} data 查询参数
			 * @description 查询
			 * @author 张航
			 * @date 2020-09-08 15:01:26
			 * @version V1.0.0
			 */
			searchControlHandle(data) {
				this.searchFormData = data
				this.refreshPageCurrent()
			},
			searchControlHandle2(data) {
				this.searchFormData2 = data
				this.refreshPageCurrent2()
			},
			/**
			 * @functionName refreshControlHandle
			 * @param {Object} data 重置后的数据
			 * @description 重置查询条件
			 * @author 张航
			 * @date 2020-09-08 17:01:51
			 * @version V1.0.0
			 */
			refreshControlHandle(data) {
				this.searchFormData = data
				this.getTableData();
			},
			refreshControlHandle2(data) {
				this.searchFormData2 = data
				this.getTableData2();
			},
			/**
			 * @functionName changeControlHeight
			 * @param {String} height 控制区占用高度
			 * @description 控制区高度变化
			 * @author 张航
			 * @date 2020-09-16 16:17:07
			 * @version V1.0.0
			 */
			changeControlHeight(height) {
				this.controlHeight = height
			},

			/**
			 * @functionName changeTableSelectData
			 * @param {Array} rows 选中数据
			 * @description 表格选中数据改变
			 * @author 张航
			 * @date 2020-09-08 17:52:12
			 * @version V1.0.0
			 */
			changeTableSelectData(rows) {
				this.tableSelectData = rows
				this.ids = rows.map(item => item.id)
			},
			changeTableSelectData2(rows) {
				this.tableSelectData2 = rows
			},
			/**
			 * @functionName checkTableSelectData
			 * @return {Number} 返回结果
			 * @description 方法描述
			 * @author 张航
			 * @date 2020-09-10 09:58:59
			 * @version V1.0.0
			 */
			checkTableSelectData() {
				if (this.tableSelectData.length === 0) {
					this.$alert('至少选择一条数据！', '提示', {
						confirmButtonText: '确定'
					})
				}
				return this.tableSelectData.length
			},
			/**
			 * @functionName changePageSize
			 * @param {Number} size 分页条数
			 * @description 修改分页条数
			 * @author 张航
			 * @date 2020-09-08 17:57:06
			 * @version V1.0.0
			 */
			changePageSize(size) {
				this.pageData.pageSize = size
				this.getTableData()
			},
			changePageSize2(size) {
				this.pageData2.pageSize = size
				this.getTableData2()
			},
			/**
			 * @functionName changePageCurrent
			 * @param {Number} current 当前分页
			 * @description 修改当前分页
			 * @author 张航
			 * @date 2020-09-08 18:02:03
			 * @version V1.0.0
			 */
			changePageCurrent(current) {
				this.pageData.pageNum = current
				this.getTableData()
			},
			changePageCurrent2(current) {
				this.pageData2.pageNum = current
				this.getTableData2()
			},
			/**
			 * @functionName refreshPageCurrent
			 * @description 重置当前分页
			 * @author 张航
			 * @date 2020-09-22 10:45:57
			 * @version V1.0.0
			 */
			refreshPageCurrent() {
				debugger
				this.pageData.pageNum = 1
				this.getTableData()
			},
			refreshPageCurrent2() {
				debugger
				this.pageData2.pageNum = 1
				this.getTableData2()
			},
			/**
			 * @functionName getTableData
			 * @description 获取表格数据
			 * @author 张航
			 * @date 2020-09-08 17:59:45
			 * @version V1.0.0
			 */
			getTableData() {
				let tmpParam = {
					...this.searchFormData,
					pageSize: this.pageData.pageSize,
					pageNum: this.pageData.pageNum
				}
				fupinlistAll(tmpParam).then(res => {
					this.tableData = res.rows
					this.pageData.total = res.total
				})
			},
			getTableData2() {
				var tmpParam = {
					...this.searchFormData2,
					pageSize: this.pageData2.pageSize,
					pageNum: this.pageData2.pageNum,
					goodsSource: this.type
				}
				if (this.type == 'LOCAL_SUPPLIER') {
					tmpParam.goodsSource = 'LOCAL_SUPPLIER';
				} else if (this.type == 'DATA_CENTER') {
					tmpParam.goodsSource = 'DATA_CENTER';
				}
				if (this.searchFormData2.category && this.searchFormData2.category.length > 0) {
					if (this.searchFormData2.category[0]) {
						tmpParam.primaryCategory = this.searchFormData2.category[0];
					}
					if (this.searchFormData2.category[1]) {
						tmpParam.secondaryCategory = this.searchFormData2.category[1];
					}
					if (this.searchFormData2.category[2]) {
						tmpParam.tertiaryCategory = this.searchFormData2.category[2];
					}
				}
				tmpParam.category = null;

				goodsList(tmpParam).then(res => {
					var arr = res.rows;
					var arr2 = this.compareList;
					arr.forEach((items) => {
						items.has = 0;
						arr2.forEach((item) => {
							if (items.id == item.goodId) {
								items.has = 1;
							}
						})
					})
					this.tableData2 = res.rows
					console.log(this.tableData2);
					this.pageData2.total = res.totalElements
				})
			},
			/**
			 * @functionName updateTableHandle
			 * @param {Object} row 当前行数据
			 * @description 表格编辑按钮
			 * @author 张航
			 * @date 2020-09-14 16:43:26
			 * @version V1.0.0
			 */
			updateTableHandle(row) {
				console.log(row)
				this.dialogFormCurrent = {
					...row
				}
				this.openDialog(1)
			},
			/**
			 * @functionName deleteTableHandle
			 * @param {Object} row 当前行数据
			 * @description 表格删除按钮
			 * @author 张航
			 * @date 2020-09-14 17:17:06
			 * @version V1.0.0
			 */
			deleteTableHandle(row) {
				this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					const {
						id
					} = row
					const {
						delete: {
							url,
							type = 'GET'
						}
					} = this.interFace
					this.interFaceEvent(url, id, type).then(res => {

						// TODO 根据接口调整处理逻辑
						// console.log(res)
						this.$message({
							message: '删除成功',
							type: 'success'
						})
						this.refreshPageCurrent()
					})
				})

			},

			/**
			 * @functionName forwardEvent
			 * @param {String} name 事件名称
			 * @param {*} data 数据
			 * @description 转发自定义事件
			 * @author 张航
			 * @date 2020-09-08 14:51:05
			 * @version V1.0.0
			 */
			forwardEvent(name, data) {
				this.$emit(name, data)
			},
			/**
			 * @functionName interFaceEvent
			 * @param {String|} url 请求地址
			 * @param {Object} data 请求参数
			 * @param {String} type 请求类型，默认为GET
			 * @return {Promise} 返回结果
			 * @description 接口访问
			 * @author 张航
			 * @date 2020-09-14 16:14:51
			 * @version V1.0.0
			 */
			interFaceEvent(url, data, type = 'GET') {
				// let _url = url
				const _type = type.toLowerCase()
				// if (_type === 'get') {
				//   _url = _url + this.$tools.urlParam(data)
				// }
				return this.$api[_type](url, data)
			},

			approved() {
				if (!this.tableSelectData || this.tableSelectData.length == 0) {
					this.$message({
						message: '请选择待操作的数据',
						type: 'warning'
					})
					return;
				}
				let ids = [];
				for (let data of this.tableSelectData) {
					if (!data.goodsState || data.goodsState != 'COMMIT') {
						this.$message({
							message: '待操作的商品中，其的状态只可是【新提交】',
							type: 'warning'
						})
						return;
					}
					ids.push(data.id);
				}
				setGoodsState("PASS", ids).then(res => {
					this.$message({
						message: '操作成功',
						type: 'success'
					})
					this.changeHistory();
					this.getTableData();
				})
			},
			back() {
				if (!this.tableSelectData || this.tableSelectData.length == 0) {
					this.$message({
						message: '请选择待操作的数据',
						type: 'warning'
					})
					return;
				}
				let ids = [];
				for (let data of this.tableSelectData) {
					if (!data.goodsState || data.goodsState != 'COMMIT') {
						this.$message({
							message: '待操作的商品中，其的状态只可是【新提交】',
							type: 'warning'
						})
						return;
					}
					ids.push(data.id);
				}
				setGoodsState("RETURN", ids).then(res => {
					this.$message({
						message: '操作成功',
						type: 'success'
					})
					this.changeHistory();
					this.getTableData();
				})
			},
			set() {
				if (!this.tableSelectData || this.tableSelectData.length == 0) {
					this.$message({
						message: '请选择待操作的数据',
						type: 'warning'
					})
					return;
				}
				let ids = [];
				for (let data of this.tableSelectData) {
					ids.push(data.id);
				}

				setIsAid(true, ids).then(res => {
					this.$message({
						message: '操作成功',
						type: 'success'
					})
					this.getTableData();
				})
			},
			cancel() {
				if (!this.tableSelectData || this.tableSelectData.length == 0) {
					this.$message({
						message: '请选择待操作的数据',
						type: 'warning'
					})
					return;
				}
				let ids = [];
				for (let data of this.tableSelectData) {
					ids.push(data.id);
				}

				setIsAid(false, ids).then(res => {
					this.$message({
						message: '操作成功',
						type: 'success'
					})
					this.getTableData();
				})
			},

			openDialog(row) {
				this.dataId = row.id;
				this.supplierName = row.supplierName;
				this.dataDetail = {};
				getLocalGoodItemDetail(row.id).then(res => {
					this.dataDetail = res
					this.dialogVisible = true;
				})
			},
			passGood() {
				const ids = [this.dataId];
				this.dataDetail.goodsState = "PASS";
				setGoodsState("PASS", ids).then(res => {
					this.$message({
						message: '操作成功',
						type: 'success'
					})
					this.dialogVisible = false;
					this.getTableData();
					this.changeHistory();
				})
			},
			backGood() {
				const ids = [this.dataId];
				// this.dataDetail.goodsState = "RETURN";
				setGoodsState("RETURN", ids).then(res => {
					this.$message({
						message: '操作成功',
						type: 'success'
					})
					this.dialogVisible = false;
					this.getTableData();
					// this.changeHistory();
				})
			},
			upDownGood(type) {
				this.dataDetail.goodsState = type;
				const ids = [this.dataId];
				setGoodsState(type, ids).then(res => {
					this.$message({
						message: '操作成功',
						type: 'success'
					})
					this.dialogVisible = false;
					this.getTableData();
					this.changeHistory();
				})
			},

			changeHistory() {
				this.dataDetail.fkItemId = this.dataDetail.id;
				this.dataDetail.goodsPrice = this.dataDetail.agreementPrice;
				this.dataDetail.supplierName = this.supplierName;
				this.dataDetail.supplierType = 1;
				systemHis(this.dataDetail).then(res => {})
			}

		},
		created() {
			this.DNS = config.DNS
		},
		mounted() {
			this.init()
		}
	}
</script>
<style lang="scss">
	.control-box {
		margin-bottom: 10px;
	}

	.line-height .el-form-item__content {
		line-height: 20px;
	}

	.dialog-form {
		margin-top: 15px;
	}

	.dialog-form ::v-deep .el-form-item__label {
		line-height: 30px;
	}

	.dialog-form ::v-deep .el-form-item__content {
		line-height: 30px;
	}

	.dialog-form ::v-deep .el-form-item {
		margin-bottom: 12px;
	}

	.dialog-form img {
		width: 100%
	}

	.has td {
		background: #ffffbe !important;
	}
</style>
